<template>
    <div style="padding: 20px">
        <avue-crud ref="crud" :option="option" v-model="form" :page.sync="page" :table-loading="loading" :data="data"
            @on-load="getList" @row-update="rowUpdate" @row-save="rowSave" @row-del="rowDel" @refresh-change="refreshChange"
            :search.sync="search" @search-reset="searchReset" @search-change="searchChange">
            <!-- <template slot="menuLeft" slot-scope="scope">
                <el-button size="small" icon="el-icon-search" @click="$refs.crud.searchChange(search)">搜索</el-button>
                <el-button size="small" icon="el-icon-delete" @click="$refs.crud.searchReset()">清空</el-button>
            </template> -->

            <template slot="menu" slot-scope="scope">
                <el-button icon="el-icon-zoom-in" type="success" size="small" @click="detail_click(scope.row)">详情
                </el-button>
                <el-button icon="el-icon-edit" type="primary" size="small" @click.stop="$refs.crud.rowEdit(scope.row)">编辑
                </el-button>
                <el-button icon="el-icon-delete" type="danger" size="small" @click.stop="$refs.crud.rowDel(scope.row)">删除
                </el-button>
            </template>

            <!--自定义列-->
            <!-- <template slot="name" slot-scope="scope">
                <a @click="viewDetail(scope.row._id)">{{ scope.row.name }}</a>
            </template> -->
        </avue-crud>

        <!--知识库文件-->
        <el-dialog :title="title" :visible.sync="knowledge_dialogVisible" :close-on-press-escape="false"
            :close-on-click-modal="false" width="80%">
            <avue-crud
                ref="crud_s"
                :option="knowledge_option"
                v-model="knowledge_form"
                :page.sync="page1"
                :table-loading="loading1"
                :data="subData"
                @row-update="rowUpdateSub"
                @row-save="rowSaveSub"
                @row-del="rowDelSub"
                :search.sync="search1"
                @size-change="sizeChange1"
                @current-change="currentChange1"
                @search-reset="searchResetSub"
                @search-change="searchChangeSub"
                >
                <template slot="menuLeft" slot-scope="scope">
                    <el-button size="small" icon="el-icon-search" @click="$refs.crud_s.searchChange(search1)">搜索</el-button>
                    <el-button size="small" icon="el-icon-delete" @click="$refs.crud_s.searchReset()">清空</el-button>
                </template>
                <template slot="menu" slot-scope="scope">
                    <el-button icon="el-icon-zoom-in" type="success" size="small" @click="add_data(scope.row)">插入数据
                    </el-button>
                    <el-button icon="el-icon-edit" type="primary" size="small" @click.stop="$refs.crud_s.rowEdit(scope.row)">编辑
                    </el-button>
                    <el-button icon="el-icon-delete" type="danger" size="small" @click.stop="$refs.crud_s.rowDel(scope.row)">删除
                    </el-button>
                </template>
            </avue-crud>
        </el-dialog>

        <!--知识库文件数据-->
        <el-dialog :title="title1" :visible.sync="collection_dialogVisible" :close-on-press-escape="false"
            :close-on-click-modal="false" width="80%">
            <avue-crud
                ref="crud_c"
                :option="collection_option"
                v-model="collection_form"
                :page.sync="page2"
                :table-loading="loading2"
                :data="collectionData"
                @row-update="rowUpdateSub2"
                @row-save="rowSaveSub2"
                @row-del="rowDelSub2"
                :search.sync="search2"
                @size-change="sizeChange2"
                @current-change="currentChange2"
                @search-reset="searchResetSub2"
                @search-change="searchChangeSub2"
                >
                <template slot="menuLeft" slot-scope="scope">
                    <el-button size="small" icon="el-icon-search" @click="$refs.crud_c.searchChange(search2)">搜索</el-button>
                    <el-button size="small" icon="el-icon-delete" @click="$refs.crud_c.searchReset()">清空</el-button>
                </template>
                <!-- <template slot="menu" slot-scope="scope">
                    <el-button icon="el-icon-zoom-in" type="success" size="small" @click="add_data(scope.row)">插入数据
                    </el-button>
                    <el-button icon="el-icon-edit" type="primary" size="small" @click.stop="$refs.crud_c.rowEdit(scope.row)">编辑
                    </el-button>
                    <el-button icon="el-icon-delete" type="danger" size="small" @click.stop="$refs.crud_c.rowDel(scope.row)">删除
                    </el-button>
                </template> -->
            </avue-crud>
        </el-dialog>
    </div>
</template>
  
<script>
import { mapGetters } from 'vuex'
import { getList, update, add, del, detail, collection_list, add_collection, update_collection, del__collection,data_list,data_add, data_update, data_del } from './api'
import option from './option'
import knowledge_option from './knowledge_option'
import collection_option from './collection_option'
import { randomString, formatYmd, formattedDateTime } from '@/utils'

export default {
    data() {
        return {
            page: {
                pageSize: 100
            },
            page1:{
                currentPage:1,
                pageSize:10,
                total:0
            },
            page2:{
                currentPage:1,
                pageSize:10,
                total:0
            },
            form: {},
            knowledge_form: {},
            collection_form:{},
            search: {},
            search1:{},
            search2:{},
            params: {},
            params1:{},
            params2:{},
            loading: false,
            loading1:false,
            loading2:false,
            data: [],
            subData:[],
            collectionData:[],
            option: option(this),
            knowledge_option: knowledge_option(this),
            collection_option:collection_option(this),
            knowledge_dialogVisible: false,
            title:'',
            title1:'',
            subId:'',
            collection_dialogVisible:false,
            subId1:''
        }
    },
    created() {

    },
    computed: {
        ...mapGetters(['userInfo'])
    },
    methods: {

        add_data(row){
            this.collection_dialogVisible = true;
            this.title1 = row.name;
            this.subId1 = row._id;
            detail({id:row._id}).then(res =>{
                this.getSubList2()
            })
        },

        closeDeploy(){
            this.knowledge_dialogVisible = false;
        },

        knowledge_submit() {

        },

        detail_click(row){
            this.knowledge_dialogVisible = true
            this.title = row.name;
            this.subId = row._id;
            this.getSubList(row)
        },

        getSubList(row){
            this.loading1 = true
            const data = Object.assign({
                datasetId:this.subId,
                parentId:'',
                pageNum: this.page1.currentPage,
                pageSize: this.page1.pageSize
            },this.params1)
            collection_list(data).then(res =>{
                const { data } = res;
                this.loading1 = false
                this.page1.total = data.total;
                const result = data.data;
                result.map(item =>{
                    item.updateTime = formattedDateTime(item.updateTime)
                    item.status = item.trainingAmount === 0?'已就绪':`${item.trainingAmount}组索引中`
                })
                this.subData = result
            })
        },

        getSubList2(){
            this.loading2 = true
            const data = Object.assign({
                collectionId:this.subId1,
                pageNum: this.page1.currentPage,
                pageSize: this.page1.pageSize
            },this.params2)
            data_list(data).then(res =>{
                const { data } = res;
                this.loading2 = false
                this.page2.total = data.total;
                const result = data.data;
                this.collectionData = result
            })
        },

        getList() {
            this.loading = true
            const data = Object.assign({
                pageNum: this.page.currentPage,
                pageSize: this.page.pageSize
            }, this.params)
            this.data = []
            getList(data).then(res => {
                const { data } = res
                this.loading = false
                this.page.total = data.length
                const result = data
                this.data = result
            })
        },
        
        
        // 新增
        rowSave(row, done, loading) {
            add(Object.assign({
            }, row)).then(() => {
                this.$message.success('新增成功')
                done()
                this.getList()
            }).catch(() => {
                loading()
            })
        },

        //子表单新增
        rowSaveSub(row,done,loading1){
            console.log(row)
            const params = {
                datasetId:this.subId,
                name:row.name,
                type:row.type
            }
            add_collection(params).then(() =>{
                this.$message.success('新增成功')
                done()
                this.getSubList()
            }).catch(() =>{
                loading1()
            })
        },

        rowSaveSub2(row,done,loading2){
            const params = {
                collectionId:this.subId1,
                q:row.q,
                a:row.a,
                indexes:[
                    {
                        defaultIndex:true,
                        type:'qa',
                        text: row.q+'\n'+row.a
                    }
                ]
            }
            data_add(params).then(() =>{
                this.$message.success('新增成功')
                done()
                this.getSubList2()
            }).catch(() =>{
                loading2()
            })
        },

        // 编辑
        rowUpdate(row, index, done, loading) {
            row.id = row._id,
                update(Object.assign({
                }, row)).then(() => {
                    this.$message.success('修改成功')
                    done()
                    this.getList()
                }).catch(() => {
                    loading()
                })
        },

        rowUpdateSub2 (row,index,done,loading2){
            const params = {
                id:row._id,
                q:row.q,
                a:row.a,
                indexes:[
                    {
                        defaultIndex:true,
                        type:'qa',
                        text: row.q+'\n'+row.a
                    }
                ]
            }
            data_update(Object.assign({
                }, params)).then(() => {
                    this.$message.success('修改成功')
                    done()
                    this.getSubList2()
                }).catch(() => {
                    loading2()
                })
        },

        //字表编辑
        rowUpdateSub(row,index,done,loading1){
            const params = {
                id:row._id,
                name:row.name
            }
            update_collection(Object.assign({
                
            }, params)).then(() => {
                this.$message.success('修改成功')
                done()
                this.getSubList()
            }).catch(() => {
                loading1()
            })
        },

        // 删除
        rowDel(row) {
            this.$confirm('此操作将永久删除, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                return del(row._id)
            }).then(() => {
                this.$message.success('删除成功')
                this.getList()
            })
        },

        rowDelSub2(row){
            this.$confirm('此操作将永久删除, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                return data_del(row._id)
            }).then(() => {
                this.$message.success('删除成功')
                this.getSubList2()
            })
        },
        //子表单删除
        rowDelSub(row){
            this.$confirm('此操作将永久删除, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                return del__collection(row._id)
            }).then(() => {
                this.$message.success('删除成功')
                this.getSubList()
            })
        },

        searchResetSub(){
            this.params1 = {}
            this.page1.currentPage = 1
            this.getSubList()
            this.$message.success('搜索成功')
        },

        searchChangeSub(params, done){
            if(done) done()
            this.params1.searchText = params.name;
            this.page1.currentPage = 1
            this.getSubList()
            this.$message.success('搜索成功')
        },

        searchResetSub2(){
            this.params2 = {}
            this.page2.currentPage = 1
            this.getSubList2()
            this.$message.success('搜索成功')
        },

        searchChangeSub2(params, done){
            if(done) done()
            this.params2.searchText = params.searchData;
            this.page2.currentPage = 1
            this.getSubList2()
            this.$message.success('搜索成功')
        },

        currentChange2(val){
            this.page2.currentPage = val
            this.getSubList2()
        },

        currentChange1(val){
            this.page1.currentPage = val
            this.getSubList()
        },

        sizeChange2(val){
            this.page2.currentPage = 1
            this.page2.pageSize = val
            this.getSubList2()
        },

        sizeChange1(val){
            this.page1.currentPage = 1
            this.page1.pageSize = val
            this.getSubList()
        },

        searchChange(params, done) {
            if (done) done()
            this.params = params
            this.page.currentPage = 1
            this.getList()
            this.$message.success('搜索成功')
        },

        searchReset() {
            this.params = {}
            this.page.currentPage = 1
            this.getList()
            this.$message.success('搜索成功')
        },

        refreshChange() {
            this.getList()
            this.$message.success('刷新成功')
        }
    }
}
</script>
<style>
.el-form a {
    color: blue;
}

.el-form a:hover {
    color: blue;
    text-decoration: underline;
}
</style>
  